<template>
	<div class="header">
		<div class="navAndBanner" >
			<nav>
				<ul>
					<li><img src="../assets/img/logo_03.png"></li>
					<li ><a @click="toindex" style="color:white">客人存酒仓管理</a></li>
					<li><a @click="tochong" style="color:white">充公酒管理</a></li>
					<li><a href="">视图</a></li>
					<li><a href="">报表</a></li>
					<li style="font-size: 1.25vw;color: white;"><a @click="tologin" style="color:white">退出</a>/<span style="cursor: pointer;" @click="showpwd = true">修改密码</span></li>
					
				</ul>
			</nav>
			
		</div>
		<passWord :showpwd="showpwd" @on-result-change="onResultChange"></passWord>
	</div>
</template>
<script>
	import passWord from '../components/password.vue'
	export default {
		name:"",
		
		components:{
			passWord
		},
		data(){
			return{
				showpwd:false,
				myshow:false
			}
		},
		mounted(){
			
		},
		methods:{
			tologin:function(){
				this.$router.push("/login")
			},
			toindex:function  () {
				// body... 
				this.$router.push("/index")
			},
			tochong:function(){
				if (this.$route.path.split("/")[1] == "chonggongFunc") {
					this.$router.push("confiscationIndex")
				}
				else{
					this.$router.push("/chonggongFunc/confiscationIndex")
				}
				
			},
			onResultChange(val){
            this.showpwd=val;//④外层调用组件方注册变更方法，将组件内的数据变更，同步到组件外的数据状态中
        }
		}
	}
</script>
<style scoped>
	.navAndBanner{
		background:linear-gradient(30deg,#b490ca,#5ebbe7);
		width: 100%;
		height: 120px;
		vertical-align: middle;
		padding-top: 40px
		
	}
	a{
		text-decoration: none;
	}
	nav ul li{
		display: inline-block;
		vertical-align: middle;
		margin-right: 5%
	}
	nav ul li a{
		font-size: 1.25vw;
		color: #999999;
	}
	nav ul li:first-child{
		margin-left: 13%;
		margin-right: 15%;
	}
	nav ul li:last-child{
		margin-top: 12px;
		float: right
		
	}
	body{background-color: #1E1E1E}
	*{padding:0;margin: 0;list-style:none;font-family: "微软雅黑"}
</style>